<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>First steps in Mono Winforms</title>
<link rel="stylesheet" href="/cfg/format.css" type="text/css">
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<meta name="keywords" content="Winforms, Mono, IronPython, programming, tutorial">
<meta name="description" content="First steps in Mono Winforms">
<meta name="language" content="en">
<meta name="author" content="Jan Bodnar">
<meta name="distribution" content="global">

<script type="text/javascript" src="/lib/jquery.js"></script>
<script type="text/javascript" src="/lib/common.js"></script>

</head>

<body>

<div class="container">

<div id="wide_ad" class="ltow">
<script type="text/javascript"><!--
google_ad_client = "pub-9706709751191532";
/* 160x600, August 2011 */
google_ad_slot = "2484182563";
google_ad_width = 160;
google_ad_height = 600;
//-->
</script>
<script type="text/javascript"
src="http://pagead2.googlesyndication.com/pagead/show_ads.js">
</script>
</div>

<div class="content">


<a href="/" title="Home">Home</a>&nbsp;
<a href=".." title="Home">Contents</a>


<h1>First steps in Mono Winforms</h1>


<p>
In this part of the IronPython Mono Winforms tutorial, we introduce some basic programs in 
Winforms programing library.
</p>

<div class="center">
<script type="text/javascript"><!--
google_ad_client = "pub-9706709751191532";
/* horizontal */
google_ad_slot = "1734478269";
google_ad_width = 468;
google_ad_height = 60;
//-->
</script>
<script type="text/javascript"
src="http://pagead2.googlesyndication.com/pagead/show_ads.js">
</script>
</div>


<h2>Simple</h2>

<p>
This is a simple Winforms application. 
</p>

<div class="codehead">simple.py</div>
<pre class="code">
#!/usr/bin/ipy

import clr

clr.AddReference("System.Windows.Forms")

from System.Windows.Forms import Application, Form

class IForm(Form):

    def __init__(self):
        self.Text = 'Simple'
        self.Width = 250
        self.Height = 200
        self.CenterToScreen()

Application.Run(IForm())
</pre>

<p>
This code example shows a small window on the screen. 
</p>

<pre class="explanation">
 clr.AddReference("System.Windows.Forms")
</pre>

<p>
We add reference for the Winforms library.
</p>

<pre class="explanation">
 class IForm(Form):
</pre>

<p>
In Winforms, any window or a dialog is a <b class="keyword">Form</b>. 
This control is a basic container, whose purpose is to display other 
child controls. Our class, IForm, inherits from a form. This way it
becomes a form itself.  
</p>

<pre class="explanation">
 self.Text = 'Simple'
 self.Width = 250
 self.Height = 200
</pre>

<p>
<b class="keyword">Text</b>, <b class="keyword">Width</b> and <b class="keyword">Height</b> 
are properties of a form. Changing these properties, we modify our form control.
The first line displays text "Simple" in the titlebar of the form control. 
The other two lines set the size of the form to 250x200 px.
</p>

<pre class="explanation">
 self.CenterToScreen()
</pre>

<p>
This method centers our application on the screen. 
</p>

<pre class="explanation">
 Application.Run(IForm())
</pre>

<p>
This line runs the example. 
</p>


<br>
<img src="/img/gui/ironpython/simple.png" alt="Simple">
<div class="figure">Figure: Simple</div>


<h2>Icon</h2>

<p>
Mono means monkey in Spanish. If we do not provide an icon for 
our application, we have a head of a monkey by default. 
The next example shows, how to change this. 
</p>

<div class="codehead">icon.py</div>
<pre class="code">
#!/usr/bin/ipy

import clr
import sys

clr.AddReference("System.Windows.Forms")
clr.AddReference("System.Drawing")

from System.Windows.Forms import Application, Form
from System.Drawing import Icon

class IForm(Form):

    def __init__(self):
        self.Text = 'Icon'
        self.Width = 250
        self.Height = 200
        
        try:
            self.Icon = Icon("web.ico")
        except Exception, e:
            print e.msg
            sys.exit(1)       
        
        self.CenterToScreen()

Application.Run(IForm())
</pre>

<p>
The code example shows an icon in the upper left corner of the form. 
A form's icon is the picture that represents the form in the taskbar as well as 
the icon that is displayed for the control box of the form.
</p>

<pre class="explanation">
 clr.AddReference("System.Drawing")
</pre>

<p>
The <b class="keyword">Icon</b> object comes from System.Drawing module.
So we have to add a reference. 
</p>


<pre class="explanation">
 try:
     self.Icon = Icon("web.ico")
 except Exception, e:
     print e.msg
     sys.exit(1)  
</pre>

<p>
It is a good practice to put all input output work between the try/except keywords. 
The web.ico file must be available in the current working directory. This is the directory
from where we execute (ipy icon.py) our application. 
</p>


<br>
<img src="/img/gui/ironpython/icon.png" alt="Icon">
<div class="figure">Figure: Icon</div>


<h2>Tooltips</h2>

<p>
A tooltip is a small rectangular pop-up window that displays a brief 
description of a control's purpose
when the user rests the pointer on the control.
</p>

<div class="codehead">tooltips.py</div>
<pre class="code">
#!/usr/bin/ipy

import clr

clr.AddReference("System.Windows.Forms")
clr.AddReference("System.Drawing")

from System.Windows.Forms import Application, Form
from System.Windows.Forms import Button, ToolTip
from System.Drawing import Point, Size

class IForm(Form):

    def __init__(self):
        self.Text = 'Tooltips'
        self.CenterToScreen()
        self.Size = Size(200, 150)

        tooltip = ToolTip()
        tooltip.SetToolTip(self, "This is a Form")

        button = Button()
        button.Parent = self
        button.Text = "Button"
        button.Location = Point(50, 70)

        tooltip.SetToolTip(button, "This is a Button")


Application.Run(IForm())
</pre>

<p>
Our code example creates a tooltip for two controls. The 
<b class="keyword">Button</b> control and the <b class="keyword">Form</b> control. 
</p>


<pre class="explanation">
 tooltip = ToolTip()
</pre>

<p>
Here we create the <b class="keyword">ToolTip</b> control. This 
instance is used to provide tooltips for both controls. 
</p>

<pre class="explanation">
 tooltip.SetToolTip(self, "This is a Form")
</pre>

<p>
Here we set a tooltip for a form. 
</p>

<pre class="explanation">
 tooltip.SetToolTip(button, "This is a Button")
</pre>

<p>
And here for the button.
</p>


<pre class="explanation">
 button = Button()
 button.Parent = self
 button.Text = "Button"
 button.Location = Point(50, 70)
</pre>

<p>

Notice the creation of the <b class="keyword">Button</b> control.
The <b class="keyword">Parent</b> property determines the container, where the button
will reside. 
The <b class="keyword">Text</b> property is a label for the button. 
The <b class="keyword">Location</b> property places the button on the 
form at x=30, y = 70 px coordinates. 
</p>


<br>
<img src="/img/gui/ironpython/tooltips.png" alt="Tooltips">
<div class="figure">Figure: Tooltips</div>


<h2>Button</h2>

<p>
Our last code example shows a button control in action. 
</p>

<div class="codehead">button.py</div>
<pre class="code">
#!/usr/bin/ipy

import clr

clr.AddReference("System.Windows.Forms")
clr.AddReference("System.Drawing")

from System.Windows.Forms import Application, Form, Button
from System.Drawing import Size, Point

class IForm(Form):

    def __init__(self):
        self.Text = 'Button'
        self.CenterToScreen()
        self.Size = Size(200, 150)

        btn = Button()
        btn.Parent = self
        btn.Text = "Quit"
        btn.Location = Point(50, 50)
        btn.Click += self.OnClick
        btn.MouseEnter += self.OnEnter


    def OnClick(self, sender, args):
        self.Close()

    def OnEnter(self, sender, args):
        print "button entered"


Application.Run(IForm())
</pre>

<p>
All GUI programming is event driven programming. In our example, we show a button control
on a form container. The button will listen to two events. The <b class="keyword">Click</b> 
and the <b class="keyword">MouseEnter</b> events. 
</p>


<pre class="explanation">
 btn.Click += self.OnClick
</pre>

<p>
This code line plugs an event handler to the <b class="keyword">Click</b> event.
When we click on the button, the <b class="keyword">OnClick()</b> method is called.  
</p>


<pre class="explanation">
 btn.MouseEnter += self.OnEnter
</pre>

<p>
When we enter the button area with the mouse pointer, the
<b class="keyword">MouseEnter</b> event is triggerd. In this
case, our code calls the <b class="keyword">OnEnter()</b> method. 
</p>

<pre class="explanation">
 def OnClick(self, sender, args):
     self.Close()
</pre>

<p>
The method closes the application. 
</p>

<pre class="explanation">
 def OnEnter(self, sender, args):
     print "button entered"
</pre>

<p>
When we enter the button control area with the mouse pointer,
"button entered" text is displayed in the terminal. 
</p>

<hr class="btm">

<p>
This part of the IronPython Mono Winforms tutorial showed some introductory
code examples to get you started with the Winforms programming library.
</p>


<div class="center">
<script type="text/javascript"><!--
google_ad_client = "pub-9706709751191532";
/* horizontal */
google_ad_slot = "1734478269";
google_ad_width = 468;
google_ad_height = 60;
//-->
</script>
<script type="text/javascript"
src="http://pagead2.googlesyndication.com/pagead/show_ads.js">
</script>
</div>
<br>


<div class="botNav, center">
<span class="botNavItem"><a href="/">Home</a></span> ‡ <span class="botNavItem"><a href="..">Contents</a></span> ‡ 
<span class="botNavItem"><a href="#">Top of Page</a></span>
</div>


<div class="footer">
<div class="signature">
<a href="/">ZetCode</a> last modified January 28, 2009  <span class="copyright">&copy; 2007 - 2012 Jan Bodnar</span>
</div>
</div>

</div> <!-- content -->

</div> <!-- container -->

</body>
</html>

